<template>
  <view class="productSort">
    <view class="search-content">
      <uni-search-bar
        class="uni-mt-10"
        radius="100"
        placeholder="搜索"
        clearButton="none"
        cancelButton="none"
        @confirm="search"
      />
    </view>

    <view class="aside">
      <scroll-view :scroll-y="true" :scroll-with-animation="true">
        <view
          class="item acea-row row-center-wrapper"
          :class="index == navActive ? 'on' : ''"
          v-for="(item, index) in leftTabArr"
          :key="index"
          @click="tapNav(index, item)"
        >
          <text>{{ item.name }}</text>
        </view>
      </scroll-view>
    </view>
    <view class="wrapper" v-if="!isEmpty">
      <view class="bgcolor">
        <view class="longTab acea-row row-middle"> </view>
      </view>

      <template v-if="loadStatus != 'loading'">
        <scroll-view :scroll-y="true" :scroll-with-animation="true" @scrolltolower="reachBottom">
          <!-- <PubGoodList :goodList="goodList"></PubGoodList> -->
          <!-- <PubIndex :isCate="true"></PubIndex> -->
          <PubOrderList2></PubOrderList2>
        </scroll-view>
      </template>

      <!-- 加载更多显示 -->
      <view class="loadStatus">
        <uni-load-more :status="loadStatus"></uni-load-more>
      </view>
    </view>
    <view class="empty" v-if="isEmpty">
      <image class="empty-image" src="@/static/images/empty.png" mode="scaleToFill" />
      <text>暂无数据</text>
    </view>
  </view>
</template>

<script lang="ts" setup>
import PubOrderList2 from '@/components/PubOrderList2.vue'
import { onShow } from '@dcloudio/uni-app'
import type { UniLoadMoreStatus } from '@uni-helper/uni-ui-types'
// import PubIndex from '@/components/PubIndex.vue'
// import PubGoodList from '@/components/PubGoodList.vue'
import { ref } from 'vue'
const loadStatus = ref<UniLoadMoreStatus>('loading')
const goodList = ref<Record<string, any>[]>([]) // 商品列表

const isEmpty = ref(false)
onShow(() => {
  getList()
})

// 请求数据
const getList = () => {
  loadStatus.value = 'loading'
  setTimeout(() => {
    loadStatus.value = 'noMore'
    goodList.value = [
      {
        store_name:
          '小米家保温杯云米电热杯茶杯水杯旅行便携式烧水壶真空304不锈钢电热水壶智能恒温保温杯400ML 云米电热水杯',
        price: 100,
      },
    ]
  }, 1000)
}

// 上拉加载
const reachBottom = () => {
  loadStatus.value = 'more'
  // getList()
}

const navActive = ref(0)
const leftTabArr = [
  {
    id: 1,
    name: '全部',
  },
  {
    id: 2,
    name: '手机数码',
  },
  {
    id: 3,
    name: '家用电器',
  },
  {
    id: 4,
    name: '电脑办公',
  },
  {
    id: 5,
    name: '计生情趣',
  },
  {
    id: 6,
    name: '美妆护肤',
  },
  {
    id: 7,
  },
]

const tapNav = (index: number, item: any) => {
  console.log(index, item)
  navActive.value = index
  if (index == 1) {
    goodList.value = []
    isEmpty.value = true
  } else {
    getList()
    isEmpty.value = false
    console.log('sssssssssssss')
  }
}

const search = () => {}
</script>
<style scoped lang="scss">
@use './index.scss';
</style>
